/*
 * @Author: 高瑞寒 15932717091@163.com
 * @Date: 2022-04-27 18:06:12
 * @LastEditTime: 2022-04-27 18:56:03
 * @LastEditors: 高瑞寒 15932717091@163.com
 * @Description: 
 */
import React, { Component } from 'react'
import './index.css'

export default class Header extends Component {
  state = { value: '' }

  handleInput = (e) => {
    this.setState({ value: e.target.value })
  }
  handleEnter = (e) => {
    if (e.keyCode === 13) {
      this.props.onSubmit(this.state.value)
      this.setState({ value: '' })


    }
  }
  render() {
    return (
      <div className="todo-header">
        <input type="text" ref={e => this.inputRef = e} value={this.state.value} onKeyUp={this.handleEnter} onInput={this.handleInput} placeholder="请输入你的任务名称，按回车键确认" />
      </div>
    )
  }
}
